/**
 * Created by zhaoxk on 2017/2/24.
 */
import React from 'react';
import { connect } from 'dva';
import { Button, Flex, Toast } from 'antd-mobile';
import _ from 'lodash';
import Table from '../../../components/table';
import InlineList from '../../../components/inline-list';

function Inspect({ data, dispatch, patient: { tableShow } }) {
    const cols = [
        {
            title: '检查日期',
            dataIndex: 'date',
        }, {
            title: '检查项目',
            dataIndex: 'bodyPart',
        }, {
            title: '检查类型',
            dataIndex: 'type',
        },
    ];

    /*
     * 从业务层变更当前展开的tbody项;
     * 这有些违背'顶层容器型组件直接绑定state'的原则，直接将state绑定至展示组件上；
     * 虽然功能可以实现，但是不利于统一管理state，和代码阅读，由但是省去了将回调绑定至容器型组件逐级下传的麻烦；
     */
    const onPress = (tableType) => (index) => {
        dispatch({
            type: 'patient/toggleTableShow',
            payload: {
                tableType,
                index,
            }
        });
    };
    const extra = (data) => {
        const NAMES = [
            ['code', '检查号'],
            ['date', '检查日期'],
            ['type', '检查类型'],
            ['diagnose', '临床诊断'],
            ['status', '状态'],
        ];
        const result = _.map(NAMES, (n) => {
            return {
                code: n[0],
                label: n[1],
                value: data[n[0]],
            };
        });
        const clickHandler = (e) => {
            e.preventDefault();
            Toast.fail('功能暂不开放！', 1);
        };

        return (
            <div>
                <InlineList
                    data={result}
                />
                <Flex style={{width: '90%', margin: '.1rem auto'}}>
                    <Flex.Item>
                        <Button type="ghost" onClick={clickHandler}>查看报告</Button>
                    </Flex.Item>
                    <Flex.Item>
                        <Button type="primary" onClick={clickHandler}>查看影像</Button>
                    </Flex.Item>
                </Flex>
            </div>
        );
    };
    return (
        <Table
            data={data}
            cols={cols}
            extra={extra}
            onPress={onPress.bind(null, 'inspect')()}
            openIndex={tableShow.inspect}
        />
    );
}

function mapStateToProps({ patient }) {
    return { patient };
}

export default connect(mapStateToProps)(Inspect);
